<template>
  <div>
    <div class="top-list">
      <div class="block" v-for="item in topList" :key="item.id">
        <Cblock
          :src="item.imgUrl"
          :describe="item.describe"
          :title="item.title"
          :price="item.price"
          :imgHeight="150"
        ></Cblock>
      </div>
    </div>
  </div>
</template>

<script>
import Cblock from '../../components/base/block'
export default {
  components: {
    Cblock
  },
  data () {
    return {
      topList: [
        {
          'id': 1001,
          'imgUrl': 'https://img.zcool.cn/community/010ab75dc8ca62a8012163ba8927fc.jpg@1280w_1l_2o_100sh.jpg',
          'describe': '情侣才能完的成的恋爱挑战',
          'title': '恋爱100挑战',
          'price': 59
        },
        {
          'id': 1002,
          'imgUrl': 'https://img.zcool.cn/community/01b45a5dc8ca2ea801209e1f6a77b5.jpg@1280w_1l_2o_100sh.jpg',
          'describe': '你和他的爱',
          'title': '恋爱100',
          'price': 159
        },
        {
          'id': 1003,
          'imgUrl': 'https://img.zcool.cn/community/013a1e5dc8c9daa8012163ba1d292d.jpg@1280w_1l_0o_100sh.jpg',
          'describe': '我和你',
          'title': '恋爱100挑战',
          'price': 549
        },
        {
          'id': 1004,
          'imgUrl': 'https://img.zcool.cn/community/010ab75dc8ca62a8012163ba8927fc.jpg@1280w_1l_2o_100sh.jpg',
          'describe': '情侣才能完的成的恋爱挑战',
          'title': '恋爱100挑战',
          'price': 1359
        },
        {
          'id': 1005,
          'imgUrl': 'https://img.zcool.cn/community/01b9f75e0969a9a801216518ad10f5.gif',
          'describe': '情侣才能完的成的恋爱挑战',
          'title': '恋爱100挑战',
          'price': 519
        },
        {
          'id': 1006,
          'imgUrl': 'https://img.zcool.cn/community/01efad5c992c91a801208f8bf5aefa.jpg@1280w_1l_2o_100sh.jpg',
          'describe': '情侣才能完的成的恋爱挑战',
          'title': '恋爱100挑战',
          'price': 519
        }
      ]
    }
  }
}
</script>

<style lang="scss" scoped>
.top-list {
    margin-left: 10px;
    .block {
        display: inline-block;
        margin: 5px;
        margin-top: 15px;
        margin-right: 10px; 
        width: 45%;
        height: 220px;
    }
}
</style>
